<template>
    <div class="oper flex align-center ml20">
        <a href="javascript:;" class="icn icn-add j-flag" title="收藏">收藏</a>
        <a href="javascript:;" class="icn icn-share" title="分享">分享</a>
    </div>
</template>

<script>
export default {};
</script>

<style lang="scss" scope>
.m-playbar .oper {
  width: 60px;
}
.m-playbar .ctrl {
  position: relative;
  z-index: 10;
  width: 113px;
  padding-left: 13px;
  background-position: -147px -238px;
}
.m-playbar .add {
  float: left;
  width: 59px;
  height: 36px;
}
.m-playbar .tip {
  position: absolute;
  top: -51px;
  left: -65px;
  clear: both;
  width: 152px;
  height: 49px;
  background-position: 0 -287px;
  text-align: center;
  color: #fff;
  line-height: 37px;
}
.m-playbar .tip-1 {
  top: -35px;
  left: 12px;
  width: 81px;
  height: 39px;
  line-height: 34px;
  background-position: 0 -457px;
}
.m-pbar {
  position: relative;
  *zoom: 1;
}
.m-pbar,
.m-pbar .barbg {
  // width: 493px;
}
.m-pbar-vol,
.m-pbar-vol .barbg {
  width: 78px;
}
.m-pbar .barbg,
.m-pbar .cur,
.m-pbar .rdy {
  height: 9px;
  background-position: right 0;
}
.m-pbar .rdy {
  background-position: right -30px;
}
.m-pbar .cur {
  position: absolute;
  top: 0;
  left: 0;
  width: 1%;
  background-position: left -66px;
}
.m-pbar .left {
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 11px;
  background-position: 0 -46px;
}
.m-pbar .btn {
  position: absolute;
  top: -7px;
  right: -13px;
  width: 22px;
  height: 24px;
  margin-left: -11px;
  background-position: 0 -250px;
}
.m-pbar .btn:hover {
  background-position: 0 -280px;
}

.m-playbar .icn {
    width: 25px;
    height: 25px;
    text-indent: -9999px;
    background: url(../assets/playbar.png) no-repeat 0 9999px;
}
.m-playbar .icn-add {
    background-position: -88px -163px;
}
.m-playbar .icn-share {
    background-position: -114px -163px;
}
</style>